<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" name="viewport">
    <meta content="ie=edge" http-equiv="X-UA-Compatible">
    <meta name="description" content="">
    <script src="/static/relation_research_check_player/js/rem.js"></script>
    <link rel="stylesheet" href="/static/relation_research_check_player/css/style.css?v=9">
    <title>鉴“渣”神器</title>
</head>
<body>
<div class="relation_research_check_player">
    <!--导航栏-->
    <div class="nav_con" style="visibility:{$is_show_nav?'visible':'hidden'}">
        <div class="nav-box">
            <div class="nav-bg-color" style="height: {$height/50 + 0.88}rem"></div>
            <div class="back_con"
                 {if $is_calculate=== 1 && isset($recode[
            'id'])}
            onclick="commonJsToNativeTransferCalculateRids('{$recode.id}', '','0');"
            {else}
            onclick="commonJsToNative('local', 'back');"
            {/if}
            >
            <img class="img_nav_back" src="/static/relation_research_check_player/images/nav/back.png" alt="">
        </div>
        <div class="title-name">鉴“渣”神器</div>
        <div class="nav_right_con"
             {if isset($share_data[
        'is_show']) && $share_data.is_show=== 1}
        onclick=commonJsToNativeShareCheckPlayerImg({$share_data.data});
        {else}
        onclick=commonJsToNative('local','{$nav_right_click_link}');
        {/if}
        >
        <div class="nav_right_title">{$share_data.is_show?'分享':'解锁记录'}</div>
        <div class="{$is_show_dot == 1 && !$share_data.is_show ? 'dot' : 'dot dot_hidden'}"></div>
    </div>
</div>
</div>
{if $error_msg == ""}
<!--中间部分-->
<div class="middle_con" style="padding-top: {$height/50 + 0.88}rem;">
    {if $page_status==0 || $page_status==1}
    <!--未选择档案 & 未解锁 部分-->
    <div class="unlock_con">

        {if $page_status == 0}
        <!--未选择档案-->
        <div class="recode_not_select_con">
            <img class="img_avatar" src="/static/relation_research_check_player/images/unlock/recode_add.png" alt=""
                 onclick="commonJsToNative('local', '{$recode.link}');">
            <div class='title'>添加Ta的档案</div>
            <div class='des'>看看Ta在感情中“渣”的可能性</div>
        </div>
        {else}
        <!--已选择档案-->
        <div class="recode_select_con">
            <div class="top_con" onclick="commonJsToNative('local', '{$recode.link}');">
                <img class="img_avatar" src="{$recode.avatar}" alt="">
                <img class="img_hint" src="/static/relation_research_check_player/images/common/recode_change_hint.png" alt="">
            </div>
            <div class='title'>{$recode.name}</div>
        </div>
        {/if}

        <!--分割线-->
        <div class="sep_line"></div>

        <!--底部介绍部分-->
        <div class="intro_con">
            <!--标题部分-->
            <div class="title_con">
                <img class="img_intro_title" src="/static/relation_research_check_player/images/unlock/intro_title.png" alt="">
                <div class="title">远离“不靠谱”的恋爱关系</div>
            </div>
            <!--介绍部分-->
            <div class="des_list_con">
                <div class="item_con">
                    <img class="img_intro_item" src="/static/relation_research_check_player/images/unlock/img_intro_item.png" alt="">
                    <div class="text_con">
                        <div class="text_normal">你经历过TA对你的<span class="text_bigger">忽冷忽热</span>吗？</div>
                    </div>
                </div>
                <div class="item_con">
                    <img class="img_intro_item" src="/static/relation_research_check_player/images/unlock/img_intro_item.png" alt="">
                    <div class="text_con">
                        <div class="text_normal">你经历过TA<span class="text_bigger">一声不响的失踪</span>吗？</div>
                    </div>
                </div>
                <div class="item_con">
                    <img class="img_intro_item" src="/static/relation_research_check_player/images/unlock/img_intro_item.png" alt="">
                    <div class="text_con">
                        <div class="text_normal">你经历过TA跟其他人<span class="text_bigger">经常暧昧不清</span>吗？</div>
                    </div>
                </div>
                <div class="item_con">
                    <img class="img_intro_item" src="/static/relation_research_check_player/images/unlock/img_intro_item.png" alt="">
                    <div class="text_con">
                        <div class="text_normal">开启鉴“渣”神器，<span class="text_bigger">拒“渣”于千里之外！</span></div>
                    </div>
                </div>
            </div>
            <!--底部图片-->
            <div class="bottom_con">
                <img class="img_intro_bottom" src="/static/relation_research_check_player/images/unlock/img_intro_bottom.png" alt="">
            </div>
        </div>

    </div>
    {/if}

    <!--已计算 & 已解锁 部分-->
    {if $page_status==2 || $page_status==3}
    <div class="calculate_or_unlock_con">
        <div class="header_bg_con">
            <div class="header_con">
                <!--档案部分-->
                <div class="recode_select_con">
                    <img class="img_avatar" src="{$recode.avatar}" alt="">
                    <div class='title'>{$recode.name}</div>
                </div>

                <!--百分比部分-->
                <div class="percent_con">
                    <!--顶部部分-->
                    <div class="top_con">
                        <img class="img_percent" src="/static/relation_research_check_player/images/common/percent_top_left.png"
                             alt="">
                        <div class="title">“渣”可能性</div>
                        <img class="img_percent" src="/static/relation_research_check_player/images/common/percent_top_right.png"
                             alt="">

                    </div>

                    <!--百分比部分-->
                    <div class="num_con">
                        <div class="text_num">{$calculate_probability}</div>
                        <div class="text_unit">%</div>
                    </div>
                </div>
            </div>
        </div>

        <!--档案修改部分（已解锁)-->
        {if $page_status == 3 && $data_recode_change.is_show == 1}
        <div class="recode_change_con">
            <div class="unlock-recode-box {$data_recode_change.is_expand?'expand':''} {$data_recode_change.is_expand?'change':''}"
                 data-expand="{$data_recode_change.is_expand?1:0}">
                <div class="unlock-recode-title">
                    <span class="title">购买时的档案信息</span>
                    <div class="is-expand-box"><span></span></div>
                </div>
                <div class="recode-info-box">
                    <div class="recode-name-box">
                        <img src="{$data_recode_change.info.avatar}" alt="">
                        <span class="recode-name">{$data_recode_change.info.name}</span>
                    </div>
                    {foreach name="$data_recode_change.info.info_list" item="listItem"}
                    <div class="recode-info-item">
                        <span class="info-title">{$listItem.title}</span>
                        <span class="info-value">{$listItem.content}</span>
                    </div>
                    {/foreach}
                </div>
                {if $data_recode_change.is_show == 1 }
                <div class="recode-change-box">
                    <img src="/static/relation_research_check_player/images/recode_change/gaojing.png" alt=""
                         class="tip-icon">
                    <img src="/static/relation_research_check_player/images/recode_change/close-icon.png" alt=""
                         class="close-icon">
                    <div class="change-title">检测到当前档案出生时间已发生修改</div>
                    <div class="change-desc">已购买的运势内容不会随着档案的修改重新计算</div>
                    <div class="change-btn" onclick="onClickUnLock('{$data_unlock_all.link}','')">再次开通</div>
                </div>
                {/if}
            </div>
        </div>
        {/if}

        <!--已经计算了，但是没有解锁部分  & 已解锁部分-->
        <div class="{$data_recode_change.is_show == 1?'content_con':'content_con content_con_border'}">

            <!--词条部分-->
            <div class="words_con">
                {foreach $unlock_data as $k=>$vo}
                <div class="item_word_con">
                    <!--分割线（只有 最后两个有）-->
                    {if $vo.status==3 || $vo.status==4}
                    <div class="sep_line"></div>
                    {/if}

                    <!--顶部标题和星级-->
                    <div class="top_title_and_star_con">
                        <!--左侧标题和图标部分-->
                        <div class="left_con">
                            <img class="img_icon" src="{$vo.icon}" alt="">
                            <div class="{$vo.status==0?'title title_normal_font_weight':'title'}">{$vo.title}</div>
                        </div>
                        <!--右侧星级部分-->
                        {if isset($vo.star) && !empty($vo.star) }
                        <div class="right_con">
                            <div class="text_star">影响星级</div>
                            <div class="star_con">
                                {foreach $vo.star as $s)}
                                <img class="img_star"
                                     src="/static/relation_research_check_player/images/caclute/star.png" alt="">
                                {/foreach}
                            </div>
                        </div>
                        {/if}
                    </div>

                    <!--词条内容-->
                    {if $vo.status == 1||$vo.status == 2}
                    <div class="content">{$vo.content}</div>
                    {/if}

                    <!--(status:0：不展示详细内容；1：隐藏展示；2：已解锁；)-->
                    <!--暂时只能看这么多了-->
                    {if $vo.status == 1}
                    <!--已计算，未解锁，盖上去的最后一行文字-->
                    <div class="content_hidden_con"></div>
                    <div class="unlock_view_hint_con">
                        <img class="img_eye" src="/static/relation_research_check_player/images/caclute/eye.png" alt="">
                        <div class="text_hint">暂时只能看这么多了</div>
                    </div>
                    {/if}


                    <!--“不靠谱”的表现形式-文字列表部分-->
                    {if $vo.status == 3}
                    <div class='content_word_list_con'>
                        {foreach $vo.content_list as $v}
                        <div class="item_text_word_con">
                            <div class="dot"></div>
                            <div class="text_content">{$v}</div>
                        </div>
                        {/foreach}
                    </div>
                    {/if}

                    <!--对异性的态度-标签列表部分-->
                    {if $vo.status == 4}
                    <div class='content_tag_list_con'>
                        {foreach $vo.content_list as $t=>$v}
                        <!--未选中的标签-->
                        <div class="selected_text_tag_content">{$v}</div>
                        {/foreach}


                    </div>
                    {/if}

                </div>
                {/foreach}

                <!--更多报告内容，解锁后可查看-->
                {if $page_status == 2}
                <div class="unlock_hint_con">
                    <div class="text_hint">更多报告内容，解锁后可查看</div>
                    <img class="img_lock" src="/static/relation_research_check_player/images/caclute/lock.png" alt="">
                </div>
                {/if}

                {if $page_status == 3}
                <div class="unlocked_hint_con">
                    本结论仅供参考，只是基于占星学的一些判断
                </div>
                {/if}
            </div>
        </div>

    </div>
    {/if}

</div>

<!--底部未选择档案 + 已选择档案 未计算的 部分-->
{if $page_status==0 || $page_status==1}
<div class="bottom_unselected_recode_or_uncalculate_con">
    {if $page_status==0}
    <div class="btn">看看Ta“渣”的可能性</div>
    {else}
    <div class="btn add_btn_selected_recode" onclick="commonJsToNativeTransferCalculateRids('{$recode.id}', '','1');">看看Ta“渣”的可能性</div>
    {/if}
</div>
{elseif $page_status == 2}
<!--底部存在已解锁的时候，增加占位-->
<div class="bottom_sep_con"></div>
<div class="bottom_active_and_unlock_con">
    {if $data_unlock_all.time > 0}
    <!--活动标示部分-->
    <div class="active_con">
        <img class="img_active" src="" alt="">
        <div class="time_con">
            <div class="text_num" id="day"></div>
            <div class="text_dot" id="dot_1"></div>
            <div class="text_num" id="hour"></div>
            <div class="text_dot" id="dot_2"></div>
            <div class="text_num" id="min"></div>
            <div class="text_dot" id="dot_3"></div>
            <div class="text_num" id="sec"></div>
        </div>
    </div>
    {/if}
    <!--解锁价格和按钮部分-->
    <div class="unlock_con">
        <div class="left_con">
            {if $data_unlock_all.time > 0}
            <!--活动的原价格-->
            <div class="price_orginal">{$data_unlock_all.price_orginal}</div>
            {/if}
            <div class="price">{$data_unlock_all.price}</div>
        </div>
        <div class="btn" onclick="onClickAll('{$data_unlock_all.link}');">解锁全部</div>
    </div>
</div>
{/if}

{else}
<div class="error_con">
    <img class="img_err" src="/static/relation_research_check_player/images/error.png" alt="">
    <div class="text_err">{$error_msg}</div>
</div>
{/if}

<!--alert部分-->
{if isset($alert) && $alert.is_show}
<div class="alert_con">
    <div class="alert_shandow"></div>
    <div class="alert_content_con">
        <div class="content">{$alert.msg}</div>
        <div class="sep_line"></div>
        <div class="bottom_btns_con">
            <div class="cancle" onclick="onClickAlertCancle()">知道了</div>
            <div class="sep_line"></div>
            <div class="ok" onclick="onClickAlertOk('{$alert.link}')">前往查看</div>
        </div>
    </div>
</div>
{/if}
</div>
{include file="../apps/web/view/public/sensors.html" /}
<script type="text/javascript">
    window.error_msg = '{$error_msg}';//是否展示日志

    window.is_show_log = '{$is_show_log}';//是否展示日志
    window.navHeight = {$height};
    window.appType = '{$appType}';
    window.isShow = 1; // 1抽屉隐藏 2抽屉显示
    window.time = '{$error_msg?0:$data_unlock_all.time}';//解锁全部时间
    window.sensor_data = JSON.parse('{:json_encode($sensor_data)}');//打点数据

    window.page_status = '{$error_msg?0:$page_status}';//当前页面状态

    window.recode = JSON.parse('{:json_encode($recode)}')

</script>
<script type="text/javascript" src="/static/relation_research_check_player/js/jquery-v2.1.1.min.js?v=9"></script>
<script type="text/javascript" src="/static/relation_research_check_player/js/common.js?v=9"></script>
<script type="text/javascript">
    if ('{$error_msg}' !== "") {//当没有异常信息的时候，才进行初始化
        console.error('{$error_msg}');
    } else {
        init();//初始化
    }
</script>
</body>
</html>
